<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>IE常见bugs以及解决方案列表_技术狂人</title>
<meta name="keywords" content="">
<meta name="description" content="1、如何解决IE6及更早浏览器浮动时产生双倍边距的BUG？2、如何解决IE6及更早浏览器下的3像素BUG？3、如何在IE6及更早浏览器下模拟min-height效果？4、如何解决IE7及更早浏览器下当li中出现2个或以上的浮动时，li之间产生的空白间隙的BUG？">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="static/css/base.css" rel="stylesheet">
<link href="static/css/index.css" rel="stylesheet">
<link href="static/css/info.css" rel="stylesheet">
<link href="static/css/m.css" rel="stylesheet">
<script src="static/js/jquery.min.js"></script>
<script src="static/js/jquery.easyfader.min.js"></script>
<script src="static/js/hc-sticky.js"></script>
<script src="static/js/comm.js"></script>

<script type="text/javascript" src="static/js/ajax.js"></script>
</head>
<body>
<header class="header-navigation" id="header">
  <nav>
    <div class="logo"><a href="index.html">技术狂人</a></div>
    <h2 id="mnavh"><span class="navicon"></span></h2>
 <ul id="starlist">
<li><a href="index.html">首页</a></li>
 
 
<li><a href="about.html">关于我</a></li> 
 
 
<li><a href="life.html">慢生活</a></li> 
 
 
<li class="selected"><a href="study.html">学无止境</a></li> 
 
 
<li><a href="time.html">时间轴</a></li> 
 
    </ul>
    <div class="searchbox">
    <div id="search_bar" class="search_bar">
      <form id="searchform" action="/e/search/index.php" method="post" name="searchform">
        <input class="input" placeholder="想搜点什么呢.." type="text" name="keyboard" id="keyboard">
        <input type="hidden" name="show" value="title">
        <input type="hidden" name="tempid" value="1">
        <input type="hidden" name="tbname" value="news">
        <input type="hidden" name="Submit" value="搜索">
        <p class="search_ico"> <span></span></p>
      </form>
     </div> 
    </div>
  </nav>
</header>
<article>
  <main>
  <div class="infosbox">
    <div class="newsview">
      <h3 class="news_title">IE常见bugs以及解决方案列表</h3>
      <div class="bloginfo">
        <ul>
          <li class="author">
作者：冼子明</li>
          <li class="lmname">学习笔记</li>
          <li class="timer">2014-05-14</li>
          <li class="view"><script src="static/js/-14_31_1.js"></script>人已阅读</li>
        </ul>
      </div>
      <div class="tags"></div>
      <div class="news_about"><strong>简介</strong>1、如何解决IE6及更早浏览器浮动时产生双倍边距的BUG？2、如何解决IE6及更早浏览器下的3像素BUG？3、如何在IE6及更早浏览器下模拟min-height效果？4、如何解决IE7及更早浏览器下当li中出现2个或以上的浮动时，li之间产生的空白间隙的BUG？</div>
      <div class="news_con"><p><strong>1、如何解决IE6及更早浏览器浮动时产生双倍边距的BUG？</strong></p>

<p class="shili">#test{display:inline;}</p>

<p><strong>2、如何解决IE6及更早浏览器下的3像素BUG？</strong></p>

<div class="shili">
<p>&nbsp;.a{color:#f00;}</p>

<p>&nbsp; .main{width:950px;background:#eee;}</p>

<p>&nbsp; .content{float:left;width:750px;height:100px;background:#ccc;_margin-right:-3px;}</p>

<p>&nbsp; .aside{height:100px;background:#aaa;}</p>

<p>&nbsp; &lt;div class=&quot;main&quot;&gt;</p>

<p>&nbsp; &nbsp; &lt;div class=&quot;content&quot;&gt;content&lt;/div&gt;</p>

<p>&nbsp; &nbsp; &lt;div class=&quot;aside&quot;&gt;aside&lt;/div&gt;</p>

<p>&nbsp; &lt;/div&gt;</p>
</div>

<p><span style="color: rgb(255, 0, 0);"><span style="font-size: 12px;">在IE6及更早浏览器下为.content设置margin-right:-3px；也可以设置.aside为浮动</span></span></p>

<p><strong>3、如何在IE6及更早浏览器下模拟min-height效果？</strong></p>

<div class="shili">
<p>#test{min-height:100px;_height:100px;}</p>
</div>

<p><span style="color: rgb(255, 0, 0);"><span style="font-size: 12px;">注意此时#test不能再设置overflow的值为hidden，否则模拟min-height效果将失效</span></span></p>

<p><strong>4、如何解决IE7及更早浏览器下当li中出现2个或以上的浮动时，li之间产生的空白间隙的BUG？</strong></p>

<p class="shili">li{vertical-align:top;}</p>

<p><strong>5、如何解决IE6使用滤镜PNG图片透明后，容器内链接失效的问题？</strong></p>

<div class="shili">
<p>div{width:300px;height:100px;_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=&#39;*.png&#39;);}</p>

<p>a{_position:relative;}</p>
</div>

<p><span style="color: rgb(255, 0, 0);"><span style="font-size: 12px;">解决方法是为容器内的链接定义相对定位属性position的值为relative</span></span></p>

<p><strong>6、IE6设置了margin:auto ,容器无法居中？</strong></p>

<p>方法一：定义宽度</p>

<p>方法二：检查DTD声明是否完整</p>

<p><strong>7、如何设置IE下的iframe背景透明？</strong></p>

<p>设置iframe元素的标签属性allowtransparency=&quot;allowtransparency&quot;然后设置iframe内部页面的body背景色为transparent。 不过由此会引发IE下一些其它问题，如：设置透明后的iframe将不能遮住select</p>

<p><strong>8、IE6 position:fixed 固定定位问题</strong></p>

<p>详细解决方案，<a href="/jstt/bj/2013-06-09/186.html" target="_blank">请点击此链接 》》》&nbsp;</a></p>

<p><strong>9、让IE6支持max-width, max-height属性</strong></p>

<p>例如：如果你有一个或多个图像，显示图像的高度和宽度应该有一些限制。即图像不应该有宽度超过500px（假设），高度不超过200px，那么图像的CSS应为如下：</p>

<div class="shili">
<p>img{&nbsp;</p>

<p>max-height:200px;max-width:500px;&nbsp;</p>

<p>width:expression(document.body.clientWidth &gt; 500? &quot;500px&quot;: &quot;auto&quot; ); &nbsp;/*for ie6*/&nbsp;</p>

<p>height:expression(document.body.clientHeight &gt; 200? &quot;200px&quot;: &quot;auto&quot; ); &nbsp;/*for ie6*/</p>

<p>&nbsp;}</p>
</div>

<p><strong>10、img图片在IE6下显示空白的Bug解决方案</strong></p>

<p>详细解决方案，<a href="/jstt/bj/2013-06-06/95.html" target="_blank">请点击此链接 》》》&nbsp;</a></p>
 </div>
    </div>
    <div class="share">
<p class="diggit"><a href="JavaScript:makeRequest('/e/public/digg/?classid=14&id=31&dotop=1&doajax=1&ajaxarea=diggnum','EchoReturnedText','GET','');"> 很赞哦！ </a>(<b id="diggnum"><script type="text/javascript" src="static/js/-12_15_5.js"></script></b>)</p>

</div>
    <div class="nextinfo">
      <p>上一篇：<a href='30.html'>css技巧以及经验总结</a></p>
      <p>下一篇：<a href='32.html'>鼠标悬停图片、文字css3效果</a></p>
    </div>
  </div>
  </main>
  <aside id="stickMe">
    <div class="r_box">     
      <div class="tuijian">
        <h2 id="tab"><a href="#" class="current">点击排行</a><a href="#">站长推荐</a></h2>       
     <div id="content">
        <ul style="display:block;">
          <li><a href="32.html" target="_blank">鼠标悬停图片、文字css3效果 </a></li>
          <li><a href="27.html" target="_blank">帝国cms常用标签调用方法总结（不得不收藏哦）... </a></li>
          <li><a href="30.html" target="_blank">css技巧以及经验总结 </a></li>
          <li><a href="33.html" target="_blank">从摄影作品中获取网页颜色搭配技巧 </a></li>
          <li><a href="28.html" target="_blank">使用ASPCMS建站网站被黑 </a></li>
          <li><a href="29.html" target="_blank">IE6到底哪里不好？你还继续用IE6吗？ </a></li>
          <li><a href="" target="_blank">IE常见bugs以及解决方案列表 </a></li>
        </ul>             
        <ul>
          <li><a href="27.html" target="_blank">帝国cms常用标签调用方法总结（不得不收藏哦）... </a></li>
          <li><a href="28.html" target="_blank">使用ASPCMS建站网站被黑 </a></li>
          <li><a href="29.html" target="_blank">IE6到底哪里不好？你还继续用IE6吗？ </a></li>
          <li><a href="30.html" target="_blank">css技巧以及经验总结 </a></li>
          <li><a href="" target="_blank">IE常见bugs以及解决方案列表 </a></li>
          <li><a href="32.html" target="_blank">鼠标悬停图片、文字css3效果 </a></li>
          <li><a href="33.html" target="_blank">从摄影作品中获取网页颜色搭配技巧 </a></li>
        </ul>
       </div>
      </div>
 <div class="wdxc">
        <h2>图文精选</h2>
        <ul>
                     <li><a href="" title="IE常见bugs以及解决方案列表" target="_blank"><img src="static/picture/1ed9f310ffdbfdbb4c695671233296b5.jpg"></a></li>
                     <li><a href="17.html" title="或许换一个活法,能让你走出阴霾" target="_blank"><img src="static/picture/43baa4c7c03ed66bae98696de5ebc64e.jpg"></a></li>
                     <li><a href="35.html" title="帝国cms列表页调用关键字tag标签" target="_blank"><img src="static/picture/fbe877634a8eb658f4d19b83c960d6ab.png"></a></li>
                     <li><a href="33.html" title="从摄影作品中获取网页颜色搭配技巧" target="_blank"><img src="static/picture/9b5abf501a88ea5d80c3ccd9978358c9.jpg"></a></li>
                     <li><a href="28.html" title="使用ASPCMS建站网站被黑" target="_blank"><img src="static/picture/2ab0bdcc2d40794f183031053dd1a4d2.jpg"></a></li>
                     <li><a href="27.html" title="帝国cms常用标签调用方法总结（不得不收藏哦）" target="_blank"><img src="static/picture/a0b65d3d8160f90f6556c4dfa3a85a59.jpg"></a></li>
                   </ul>
      </div>
<div class="cloud">
      <h2>标签云</h2>
      <ul>
 <a href="tags.html" target="_blank">云南</a>      </ul>
    </div>
      <div class="guanzhu">
        <h2>关注我 么么哒</h2>
        <ul>
          <img src="static/picture/wx.png">
        </ul>
      </div>
    </div>
  </aside>
</article>
<footer>
  <p>Design by <a href="index.html" target="_blank">技术狂人</a> <a href="http://beian.miit.gov.cn/get="_blank">粤ICP备2024236460号-4</a></p>
</footer>
<a href="#" class="cd-top">Top</a><script src="static/js/js.js"></script></body>
</html>
